﻿<!DOCTYPE  html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <title>地图</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta http-equiv="cache-control" content="no-cache, must-revalidate">
    <meta content="width=1200, initial-scale=1, maximum-scale=1, user-scalable=1" name="viewport">

    <link rel="stylesheet" type="text/css" th:href="@{/css/font-awesome.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/map.css}"/>
</head>

<body>
    <div id="wrapper" class="wrapper">
        <input type="hidden" id="cityId"/>
        <input type="hidden" id="countyId"/>
        <input type="hidden" id="townId"/>
        <div id="header" class="header">
            <div class="logo">
                <a href="/">
                    <img src="/images/newIndex/logo.png" width="58" height="34">
                </a>
            </div>
            <dl class="cityBox" id="cityBox">
                <dt><span id="curCityName"></span></dt>
                <dd id="cityList" class="ani">
                </dd>
            </dl>
            <div class="searchBox">
                <div class="con">
                    <input type="text" class="inp" id="J_keywords" placeholder="请输入上班地点" />
                    <input type="text" class="inp" id="J_MyKeywords" placeholder="请输入小区、商圈" />
                    <div class="t_ajaxbox" id="ajaxBox">
                        <ul id="suggestion"></ul>
                    </div>
                    <div class="userState" id="J_UserState">
                        <div id="loginState" th:if="${session.userLoginKey_==null}">
                            <a href="/login/index?uri=/map" id="login">登录</a><i>|</i><a href="/register/index?uri=/map" id="register">注册</a>
                        </div>

                        <div onmouseenter="setUlShow()"  onmouseleave="canelUlShow()" class="fr" style="height: 80px;line-height: 0px;cursor: pointer;text-align: center;width: 100px" th:if="${session.userLoginKey_!=null}">
                            <i style="background: url(../images/logins/user_ico.png) no-repeat;width: 21px;height: 25px;display: inline-block;"></i>
                            <ul class="ui">
                                <li><a href="#">个人空间</a></li>
                                <li><a href="#">编辑资料</a></li>
                                <li><a href="#">我的约看</a></li>
                                <li><a href="/login/logout?uri=/map">退出</a></li>
                            </ul>
                        </div>
                    </div>

                </div>

            </div>
            <!--/searchBox-->
        </div>
        <!--/header-->
        <div class="selectBox clearfix " id="selectBox">
            <dl class="selectList moreList typeList">
                <dt><span id="J_typeVal">合租整租 <i class="n" id="J_typeNum"></i><b class="ani"></b></span></dt>
                <dd class="ani" id="typeList">
                    <div class="clearfix" id="J_typeList"></div>
                    <!--/clearfix-->
                    <div class="btns clearfix">
                        <input type="button" value="取消" class="cancel " id="J_typeCancel" />
                        <input type="button" value="确定" class="confirm J_toAjax" id="J_typeConfirm" />
                    </div>
                </dd>
                <!--/selectLists-->
            </dl>

            <dl class="selectList">
                <dt><span id="J_priceVal">价格 <b class="ani"></b></span></dt>
                <dd class="ani J_selectListForA" id="J_priceList"></dd>
                <!--/selectLists-->
            </dl>
            <dl class="selectList">
                <dt><span id="J_faceVal">朝向 <b class="ani"></b></span></dt>
                <dd class="ani J_selectListForA" id="J_faceList"></dd>
                <!--/selectLists-->
            </dl>
            <dl class="selectList" id="J_areaListBox" style="display: none;">
                <dt><span id="J_areaVal">面积 <b class="ani"></b></span></dt>
                <dd class="ani J_selectListForA" id="J_areaList"></dd>
                <!--/selectLists-->
            </dl>
            <dl class="selectList moreList moreList2">
                <dt><span id="J_moreVal">更多<i class="n" id="J_moreNum"></i> <b class="ani"></b></span></dt>
                <dd class="ani ">
                    <div id="J_moreList"></div>
                    <div class="btns clearfix">
                        <input type="button" value="取消" class="cancel " id="J_cancel" />
                        <input type="button" value="确定" class="confirm J_toAjax" id="J_confirm" />
                    </div>
                </dd>
                <!--/selectLists-->
            </dl>
            <dl class="selectList_last">
                <a href="javascript:;" id="J_clear" class="J_toAjax">清除所有选项</a>
            </dl>
        </div>
        <!--/selectBox-->
        <div class="bgShadow" id="J_bgShadow"></div>
        <!--/bgShadow-->
        <div class="content" id="content">
            <div class="leftCon" id="leftCon">
                <div id="r-result"></div>
                <ul class="sortingList clearfix" id="J_sortingList">
                    <li class="active" data-type="duration" data-flag="desc"><a href="javascript:;">默认排序</a></li>
                    <li class="middle" data-type="rent" data-flag="desc"><a href="javascript:;">价格排序</a></li>
                    <li data-type="area" data-flag="desc"><a href="javascript:;">面积排序</a></li>
                </ul>
                <!--/sortingList-->
                <div class="" id="scrollContent">
                    <ul class="houseList" id="J_houseList">
                    </ul>
                </div>
                <!--/scrollContent-->
                <p id="J_loading">正在加载中……</p>
            </div>
            <!--/leftCon-->
            <div class="mapBox" id="mapBox">
                <div id="J_mainLoading">正在加载中……</div>
                <div class="tongqinBox ani" id="J_TqBox">
                    <div class="lCon" id="J_TqLeft">
                        <ul id="J_tqType"></ul>
                        <ul id="J_tqMin"></ul>
                    </div>
                    <div class="rCon" id="J_TqRight">
                        <ul>
                            <li><a href="javascript:;" class="last" id="J_TqRightBtn">打开通勤找房</a></li>
                        </ul>
                    </div>
                </div>
                <div id="J_centerTqMarker">
                    <p>在这里上班 &gt;</p>
                </div>

                <div class="leftPos clearfix">
                    <div class="pos_l" id="J_slideLeft">

                        <div href="javascript:;" class="zoom">
                            <a href="javascript:;" class="jia" id="zoomin"></a>
                            <a href="javascript:;" class="jian" id="zoomout"></a>
                        </div>
                    </div>
                    <!--/pos_l-->
                    <div class="pos_r">
                        <a href="javascript:;" class="getDistance" id="J_getDistance">测距</a>
                        <!-- <dl id="J_round">
                            <dt id="J_roundName">周边</dt>
                            <dd id="J_roundList">
                                <a href="javascript:;" data-value=""><span>无<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="银行"><span>银行<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="公交"><span>公交<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="地铁"><span>地铁<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="教育"><span>教育<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="医院"><span>医院<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="休闲"><span>休闲<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="购物"><span>购物<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="健身"><span>健身<b><s class="ani"></s></b></span></a>
                                <a href="javascript:;" data-value="美食"><span>美食<b><s class="ani"></s></b></span></a>

                            </dd>
                        </dl> -->
                        <a href="javascript:;" class="posCen J_toAjax" id="J_BackCenter">回到默认</a>
                    </div>
                    <!--/pos_r-->
                </div>
                <!--/leftPos-->
                <div id="allmap">

                </div>
                <!--/allmap-->
            </div>
            <!--/mapBox-->

        </div>
        <!--/content-->
    </div>
    <!--/wrapper-->

    <script id="tqTypeTpl" type="text/html">
        {{each data as value}}
        <li data-val="{{value.id}}"><a href="javascript:;">{{value.name}}</a></li>
        {{/each}}
    </script>
    <script id="tqMinTpl" type="text/html">
        {{each sections as value}}
        <li data-val="{{value}}"><a href="javascript:;">{{value}}分内</a></li>
        {{/each}}
    </script>
    <script id="typeListTpl" type="text/html">
        {{each data as value}}
        <h2>{{ value.title }}</h2>
        <div class="con clearfix">
            {{each value.list as v}}
            <a href="javascript:;" class="checkbox " data-val="{{v.value}}"><span>{{v.title}}</span></a> {{/each}}
        </div>
        {{/each}}
    </script>

    <script id="moreListTpl" type="text/html">
        {{each data as value}}
        <h2>{{ value.title }}</h2>
        <div class="con clearfix">
            {{each value.list as v}} {{if value.title == '租约类型' }}
            <a href="javascript:;" data-name="{{value.name}}" class="radio " data-val="{{v.value}}"><span>{{v.title}}</span></a> {{else if value.title == '房屋状态'}}
            <a href="javascript:;" data-name="{{value.name}}" class="radio " data-val="{{v.value}}"><span>{{v.title}}</span></a> {{else}}
            <a href="javascript:;" data-name="{{value.name}}" class="checkbox " data-val="{{v.value}}"><span>{{v.title}}</span></a> {{/if}} {{/each}}
        </div>
        {{/each}}
    </script>

    <script id="filterListTpl" type="text/html">
        {{each data as value}}
        <a href="javascript:;" data-txt="{{value.title}}" data-val="{{value.value}}" data-for="{{t}}" class="J_toAjax"><span>{{value.title}} <b><s class="ani"></s></b></span></a> {{/each}}
    </script>
    <script id="houseListTpl" type="text/html">
        {{if data==null || data.length == 0 }}
        <div class="noneHouse" id="J_noneHouse">
            <img src="/images/map/none.png">
            <p>地球上没有您要找的房源</p>
        </div>
        {{else}} {{each data as value}}
        <li data-id="{{value.id}}" data-totalPage="10">
            <a href="/detail?houseId={{value.id}}&type=5" class="clearfix">
                <div class="img">
                    <img src="{{value.cover}}" onerror="this.style.display='none'">
                </div>
                <div class="txt">
                    <h3>{{if value.ownerRent}}直租·{{/if}}{{if value.entireRent}}整租·{{else}}合租·{{/if}}{{value.regionName}}-{{value.name}}·{{value.roomNum}}居室-
                        {{if value.orientation==1}}东{{/if}}{{if value.orientation==2}}南{{/if}}{{if value.orientation==3}}西{{/if}}{{if value.orientation==4}}北{{/if}}
                    </h3>
                    <div class="desc">
                        <span class="gray bor_r">{{value.area}}㎡</span><span class="gray">{{value.floor}}/{{value.totalFloor}}层</span>
                        <p class="price">
                            <span class="org">¥{{value.rent}}</span>元/月
                        </p>
                    </div>
                    <p class="pos">{{if value.houseTrafficList.length!=0}}{{value.houseTrafficList[0].traffic}}{{/if}}</p>
                    <div class="tags clearfix">
                        {{if value.houseTags.length!=0}}
                        {{each value.houseTags as tag}}
                           <span>{{tag.name}}</span>
                        {{/each}}
                        {{/if}}
                    </div>

                </div>
            </a>

        </li>
        {{/each}} {{/if}}
    </script>
    <script type="text/javascript" th:src="@{/js/jquery-1.8.3.min.js}"></script>
    <script type="text/javascript" th:src="@{http://api.map.baidu.com/api?v=2.0&ak=CB9b776692623d30a148b5c5dc2b75a6}"></script>
    <script type="text/javascript" th:src="@{http://api.map.baidu.com/library/DistanceTool/1.2/src/DistanceTool_min.js}"></script>
    <script type="text/javascript" th:src="@{/js/arttemplate.js}"></script>
    <script type="text/javascript" th:src="@{/js/jquery.mcustomscrollbar.concat.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/setfilter.js}"></script>
</body>

</html>